<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
    pageEncoding="ISO-8859-1"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib uri="http://tiles.apache.org/tags-tiles" prefix="tiles"%>
<%@ taglib prefix="jwr"  uri="http://jawr.net/tags-el" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<%@ taglib prefix="spring" uri="http://www.springframework.org/tags"%>
<%@ taglib prefix="security" uri="http://www.springframework.org/security/tags" %>
<%@ taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %>
<%@ taglib prefix="form" uri="http://www.springframework.org/tags/form" %>

<div id="tabContent" style="min-height: 500px;">

	<input type="hidden" id="mode" value="${mode}" />
		<div style="padding: 10px 0px 20px 0px;">
			<div id=returnToReviewListDiv" style="text-align: right;float: right;">
				<input class="btnClass" onclick="returnToReviewList();"
				     id="btnReturnToReviewList" name="btnReturnToReviewList" type="button" value="Return to Review List"/>
			</div>
			<div class="font-header"><fmt:message key="location.setup.review.${mode}.title"></fmt:message></div>
			<div style="clear: both;"></div>
		</div>
		<div class="instruction-sub-text" style="margin: 5px 0px">
			<fmt:message key="location.setup.review.${mode}.label"></fmt:message>
		</div>
		
		<div style="float: left;">
			<div>
				<div class="arrow-bullet" style="float: left;margin-top: 8px;">&nbsp;</div>
				<div style="float: left;width: 120px;">Create a Review</div>
				<div style="width: 653px;border-bottom: 1px solid #55648f;margin-top:-10px;float: left;">&nbsp;</div>
			</div>			
		</div>
		
	<form:form modelAttribute="review" id="reviewForm" name="reviewForm" action="reviews/save">
		<form:hidden path="id"/>
		<div class="gray-form-background" style="margin: 0px 0px; height: 100%; clear: both;">
				<div id="locationNameDiv">
					<div class="font-form-field-detail"
						style="float: left; text-align: right; padding-top: 20px; line-height: 40px; width: 110px; vertical-align: middle;">
						Owner Name *:</div>
					<div style="margin-top: 4px; margin-left: 10px; width: 240px; float: left;">
						
						<span class="font-form-field-detail"></span><br>
						<div class="form-fieldtop">
							<div class="form-fieldb1"></div>
							<div class="form-fieldb2"></div>
						</div>
						<div class="form-fieldcontent">
							
							<form:input path="ownerName" maxlength="35" style="width: 233px;" 
								cssClass="required" onkeypress="javascript:return formFireDefaultButton(event, 'btnUpdateReview')"/>
						</div>
						<div class="form-fieldtop">
							<div class="form-fieldb2"></div>
							<div class="form-fieldb1"></div>
						</div>
						<div id="advice-required-ownerName" class="x-icon" style="display: none;position: static;">Owner name is required.</div>						
					</div>
					
					<div class="font-form-field-detail"
						style="float: left; text-align: right; padding-top: 20px; line-height: 40px; width: 110px; vertical-align: middle;">
						Email Id:</div>
					<div style="margin-top: 4px; margin-left: 10px; width: 220px; float: left;">
						<span class="font-form-field-detail"></span><br>
						<div class="form-fieldtop">
							<div class="form-fieldb1"></div>
							<div class="form-fieldb2"></div>
						</div>
						<div class="form-fieldcontent">
							<form:input path="emailId" maxlength="100" cssClass="validate-email"
								cssStyle="width: 213px;" onkeypress="javascript:return formFireDefaultButton(event, 'btnUpdateLocation')"/>
						</div>
						<div class="form-fieldtop">
							<div class="form-fieldb2"></div>
							<div class="form-fieldb1"></div>
						</div>
						<div id="advice-validate-email-emailId" class="x-icon" style="display: none; position: static;">Invalid Email Id.</div>						
					</div>
					
				</div>
				<div style="clear: both;height: 7px;">&nbsp;</div>
				<div id="ratingDiv">
					<div class="font-form-field-detail"
						style="float: left; text-align: right; padding-top: 20px; line-height: 40px; width: 110px; vertical-align: middle;">
						Rating *:</div>
					<div style="margin-top: 4px; margin-left: 10px; width: 240px; float: left;">
						
						<span class="font-form-field-detail"></span><br>
						<form:select path="rating" cssClass="validate-selection">
							<form:option value="0">Select Rating</form:option>
							<form:option value="1">1</form:option>
							<form:option value="2">2</form:option>
							<form:option value="3">3</form:option>
							<form:option value="4">4</form:option>
							<form:option value="5">5</form:option>
						</form:select>
						<div id="advice-validate-selection-rating" class="x-icon" style="display: none;position: static;">Please provide you rating.</div>						
					</div>
					<div class="font-form-field-detail"
						style="float: left; text-align: right; padding-top: 20px; line-height: 40px; width: 110px; vertical-align: middle;">
						Phone #:</div>
					<div
						style="margin-top: 4px; margin-left: 10px; width: 220px; float: left;">
						<span class="font-form-field-detail"></span><br>
						<div class="form-fieldtop">
							<div class="form-fieldb1"></div>
							<div class="form-fieldb2"></div>
						</div>
						<div class="form-fieldcontent">
							<form:input path="phoneNumber" maxlength="100"
								cssStyle="width: 213px;" cssClass="validate-india-phone-number"
								onkeypress="javascript:return formFireDefaultButton(event, 'btnUpdateLocation')"/>
						</div>
						<div class="form-fieldtop">
							<div class="form-fieldb2"></div>
							<div class="form-fieldb1"></div>
						</div>
						<div id="advice-validate-india-phone-number-phoneNumber" class="x-icon" style="display: none; position: static;">Invalid Phone Number.</div>
					</div>
					
					
				</div>
				<div style="clear: both;height: 7px;">&nbsp;</div>
				<div id="locationAddressDiv">
					<div class="font-form-field-detail"
						style="float: left; text-align: right; padding-top: 20px; line-height: 40px; width: 110px; vertical-align: middle;">
						Description *:</div>
					<div style="margin-top: 4px; margin-left: 10px; width: 340px; float: left;">
						<span class="font-form-field-detail"></span><br>
						<div class="form-fieldtop">
							<div class="form-fieldb1"></div>
							<div class="form-fieldb2"></div>
						</div>
						<div class="form-fieldcontent">
							<form:textarea path="description" 
								cssStyle="width: 333px;max-width:333px;min-width:333px;min-height:200px;max-height:200"  maxlength="500"
								cssClass="required validate-description" onkeypress="javascript:return formFireDefaultButton(event, 'btnUpdateReview')"/>
						</div>
						<div class="form-fieldtop">
							<div class="form-fieldb2"></div>
							<div class="form-fieldb1"></div>
						</div>
						<div id="advice-required-description" class="x-icon" style="display: none; position: static;">Please enter Review description.</div>		
					</div>
					
					
				</div>
				<div style="clear: both;height: 7px;">&nbsp;</div>
				<div id="reviewPublishDiv">
					<div class="font-form-field-detail"
						style="float: left; text-align: right; padding-top: 20px; line-height: 40px; width: 110px; vertical-align: middle;">
						Published:</div>
					<div style="margin-top: 4px; margin-left: 10px; width: 340px; float: left;">
						<span class="font-form-field-detail"></span><br>
						<form:checkbox path="publish"/>
					</div>
					
					<div class="font-form-field-detail"
						style="float: left; text-align: right; padding-top: 20px; line-height: 40px; width: 150px; vertical-align: middle;">
						Subscribed for offers?</div>
						<div style="margin-top: 10px; margin-left: 10px; width: 120px; float: left;">
							<span class="font-form-field-detail"></span><br>
							<form:checkbox path="subscribed"/>
						</div>
					
				</div>
				<div style="clear: both;height: 7px;">&nbsp;</div>
				
			</div>
			
			<div style="float: right;padding-right: 20px;padding-top: 20px;">
			<input id="btnCancelReview" name="btnCancelReview"  class="button-text" 
					value="Cancel" onclick="returnToReviewList();" type="button" />
				<input class="btnClass" id="btnUpdateReview" name="btnUpdateReview" type="button" value="Submit"/>
			</div>
	</form:form>
	
	
</div>

<script type="text/javascript">
	dojo.connect(eleById("btnUpdateReview"), "onclick", null, function(){
			var reviewFormValidator = new Validation('reviewForm', {onSubmit : true});
			reviewFormValidator.reset();					
			var isValid = reviewFormValidator.validate();
			if(isValid){
				Spring.remoting.submitForm('btnUpdateReview', 'reviewForm'); 
				return true;
			}
			return false;
	});
</script>